<script setup name="Home">
import { onMounted, computed, ref } from "vue";
import Evaluate from "./components/Evaluate/Evaluate.vue";
import QuestionList from "./components/QuestionList/QuestionList.vue";
import Resume from "./components/Resume/Resume.vue";
import { useRoute } from "vue-router";
import { useInterviewStore } from "@/store";
import { setToken } from "../../utils/auth";

const interviewStore = useInterviewStore();
const route = useRoute();
const localToken = ref("");

const loading = ref(false);

onMounted(() => {
  loadData();
});

async function loadData() {
  const { confId, token } = route.query;
  if (token) {
    setToken(token);
    localToken.value = token;
  }
  if (confId) {
    interviewStore.setConfId(confId);
    loading.value = true;
    await interviewStore.getResumeAction();
    await interviewStore.getInterviewInfoAction();
    await interviewStore.getInterviewReportsAction();
    loading.value = false;
  }
}

const confId = computed(() => interviewStore.confId);
const isFirst = computed(
  () => interviewStore.interviewInfo && interviewStore.interviewInfo.firstInterview
);
</script>

<template>
  <div class="home-content pb-5">
    <div v-if="!localToken">请先登录</div>
    <div class="loading-containter" v-else-if="loading">
      <van-loading size="24px">加载中...</van-loading>
    </div>
    <div v-else>
      <van-tabs
        v-model:active="active"
        sticky
        color="#436BFF"
        line-width="20"
        v-if="confId"
      >
        <van-tab title="AI建议面试题">
          <QuestionList />
        </van-tab>
        <van-tab title="候选人简历">
          <Resume />
        </van-tab>
        <van-tab title="面试评价" v-if="!isFirst">
          <Evaluate />
        </van-tab>
      </van-tabs>
      <div v-else>暂无简历</div>
    </div>
  </div>
</template>

<style>
.loading-containter {
  width: 100%;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
}
</style>
